﻿@model FTBS.Models.Entities.Concert.SettingTheaterConcertEntity


<body onload="initialize()">
    <div>
        @using (Html.BeginForm("Create", "Theater", null, FormMethod.Post,
                              new { enctype = "multipart/form-data" }))
        {
            //@Html.ValidationSummary(true)
            @Html.HiddenFor(model => model.IsCreatingTheater)
            @Html.HiddenFor(model => model.IsValidTheater)
            @Html.HiddenFor(model => model.IsValidSetting)
            @Html.HiddenFor(model => model.IsExistTheaterName)
            @Html.HiddenFor(model => model.IsFinish)
            <table class="table striped bordered hovered">
                <tr>
                    <th style="text-align: left">Tên rạp phim
                    </th>
                    <td>
                        <div class="input-control text">
                            @Html.EditorFor(model => model.TheaterName, new { id = "theaterName" })
                            <p style="color: red; font-size: 10pt">@Html.ValidationMessageFor(model => model.TheaterName)</p>
                            @if (Model.IsExistTheaterName == true)
                            {
                                <p style="color: red; font-size: 10pt">Tên rạp phim đã tồn tại!</p>
                            }
                        </div>
                    </td>
                </tr>
                <tr>
                    <th style="text-align: left">Số điện thoại
                    </th>
                    <td>
                        <div class="input-control text">
                            @Html.EditorFor(model => model.PhoneNumber, new { id = "phoneNumber" })
                            <p style="color: red; font-size: 10pt">@Html.ValidationMessageFor(model => model.PhoneNumber)</p>
                        </div>
                    </td>
                </tr>
                <tr>
                    <th style="text-align: left">Thuộc cụm rạp
                    </th>
                    <td>
                        <div>
                            @Html.DropDownListFor(model => model.UserName, (SelectList)ViewBag.ListSupplier, new { style = "height:35px" })
                            <p style="color: red; font-size: 10pt">@Html.ValidationMessageFor(model => model.UserName)</p>
                        </div>
                    </td>
                </tr>
                <tr>
                    <th style="text-align: left">Địa chỉ
                    </th>
                    <td colspan="3">
                        <div class="input-control text">
                            @Html.TextBoxFor(model => model.Address, new { id = "address" })
                            <p style="color: red; font-size: 10pt">@Html.ValidationMessageFor(model => model.Address)</p>
                            <p style="color: red; font-size: 10pt">@Html.ValidationMessageFor(model => model.Latitude)</p>
                            <p style="color: red; font-size: 10pt">@Html.ValidationMessageFor(model => model.Longitude)</p>
                            <p id="errorAddress" style="color: red"></p>
                        </div>
                    </td>
                </tr>
                <tr style="display: none">
                    <th style="text-align: left">Vĩ độ
                    </th>
                    <td>
                        <div class="input-control text">
                            @Html.TextBoxFor(model => model.Latitude, new { id = "latitude", @readonly = true })
                        </div>
                    </td>
                </tr>
                <tr style="display: none">
                    <th style="text-align: left">Kinh độ
                    </th>
                    <td>
                        <div class="input-control text">
                            @Html.TextBoxFor(model => model.Longitude, new { id = "longitude", @readonly = true })

                        </div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <input class="inverse" type="button" value="Lấy tọa độ rạp phim" onclick="codeAddress()" />
                    </td>
                    <td colspan="3">
                        <div id="map_canvas" style="width: 500px; height: 270px;"></div>
                    </td>
                </tr>
                <tr>
                    <th style="text-align: left">Ảnh đại diện
                    </th>
                    <td colspan="3">
                        <div class="input-control file info-state" data-role="input-control">
                            <input id="ImagePath" title="Upload a product image" type="file" name="fileCreate" />
                            <input type="text" id="__input_file_wrapper__" readonly="" style="z-index: 1; cursor: default;">
                            <button class="btn-file" type="button" name="submit"></button>
                        </div>
                        <p style="color: red; font-size: 10pt">@Html.ValidationMessageFor(model => model.ImageURL)</p>
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                <div>
                    <input class="button info" type="submit" value="Lưu" style="text-align: center; width: 77px" />
                    <button class="button danger" style="float: right">
                        @Html.ActionLink("Quay Lại", "Index")
                    </button>
                </div>
            </td>
                </tr>
            </table>
        }
    </div>

</body>


<script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script>
<script type="text/javascript">

    var geocoder;
    var map;
    function initialize() {
        geocoder = new google.maps.Geocoder();
        var latlng = new google.maps.LatLng(0, 0);
        var myOptions = {
            zoom: 17,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    }

    function codeAddress() {
        geocoder = new google.maps.Geocoder();
        var address = document.getElementById("address").value;
        if (address.length > 0) {
            geocoder.geocode({ 'address': address }, function (results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    map.setCenter(results[0].geometry.location);
                    var marker = new google.maps.Marker({
                        map: map,
                        draggable: true,
                        position: results[0].geometry.location
                    });
                    document.getElementById("errorAddress").innerHTML = "";
                    $('#latitude').val(results[0].geometry.location.lat());
                    $('#longitude').val(results[0].geometry.location.lng());
                } else {
                    document.getElementById("errorAddress").innerHTML = "Không thể lấy được tọa độ rạp phim! Xin hãy nhập địa chỉ cụ thể hơn!";
                    $('#latitude').val("");
                    $('#longitude').val("");
                }
            });
        }
        else {
            document.getElementById("errorAddress").innerHTML = "Xin hãy nhập địa chỉ của rạp phim!";
            $('#latitude').val("");
            $('#longitude').val("");
        }
    }


</script>


